<span class="page-title"><i class="fa fa fa-magic"></i> Rules </span>

<section class="content-header">
    <h1>
        <i class="fa fa-magic"></i> Rules
        <small> Do intelligent stuff here</small>
    </h1>

    <ol class="breadcrumb">
        <li>
            <div class="input-group input-group-sm" style="width: 150px;">

                <input ng-model="searchFilter" class="form-control pull-right" placeholder="Search">

                <div class="input-group-btn">
                    <button type="submit" class="btn btn-info"><i class="fa fa-search"></i></button>
                </div>
            </div>
        </li>
        <li><a href="#/rules/new" class="btn btn-info pull-right" role="button"><i class="fa fa-plus"></i> New Rule</a></li>
    </ol>
</section>


<!-- Main content -->
<section class="content" data-ng-init="ctrl.init()">

    <div class="box box-info">
        <div class="box-body table-responsive no-padding">
            <table class="table table-responsive">
                <tbody>
                <tr>
                    <th width="30">Enabled</th>
                    <th>Type</th>
                    <th>Description</th>
                    <th>Conditions</th>
                    <th>Actions</th>
                    <th>Last Execution</th>
                    <th>--</th>
                </tr>
                <tr ng-repeat="x in ctrl.list | filter:searchFilter">
                    <td class="text-center">
                        <div class="checkbox checkbox-success checkbox-circle" data-toggle="tooltip" title="Click to Enable/Disable">
                            <input id="checkbox${::x.id}" class="styled" type="checkbox" ng-model="x.enabled" ng-change="ctrl.activate(x)">
                            <label for="checkbox${::x.id}"></label>
                        </div>
                    </td>
                    <td>${ ::x.type }</td>
                    <td>
                        <a role="button" ng-href="#/rules/${::x.id}">${ ::x.description }</a>
                    </td>
                    <td>
                        <small class="label bg-gray">${ ::x.resourceID | deviceNameRef } == ${ ::x.value}</small> &nbsp; ${ ::x.condition | conditionType }
                    </td>
                    <td>${ ::x.action | actionType }</td>

                    <td ng-if="x.status == 'ACTIVE'">
                        <small class="label bg-green">Active</small>
                    </td>
                    <td ng-if="x.status != 'ACTIVE'">
                        ${ ::x.lastExecution | date:'hh:mm:ss - dd/MM' }
                    </td>
                    <td>
                        <a role="button" class="btn btn-xs btn-warning" ng-href="#/rules/${::x.id}"><i class="fa fa-edit"></i></a>
                        <a role="submit" class="btn btn-xs btn-danger" ng-really-click="ctrl.delete(x, $index)"><i class="fa fa-remove"></i></a>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>


</section>
